<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="author" content="Yb">
    <title>商品分类</title>
    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="../css/category-index.css">
    <link rel="stylesheet" href="../css/navbarBtt.css">
</head>

<body>
    <header>
        <nav>
            <a href=""><img src="images/icon_back_n.png" alt=""></a>
            <span>商品分类</span>
            <a href=""><span class="glyphicon glyphicon-search"></span></a>
        </nav>
    </header>
    <nav class="mainLine">
        <a href="">手机·电话卡</a>
        <a href="">笔记本·平板</a>
        <a href="">电视·盒子</a>
        <a href="">智能硬件·路由器</a>
    </nav>
    <!--手机·电话卡-->
    <section class="mybanner">
        <a href="">
            <img src="images/category_header01.jpg" alt="">
        </a>
    </section>
    <section>
        <header class="mainLine mainHead">
            <div>手机·电话卡</div>
        </header>
        <div class="main">
            <div>
                <a href="">
                    <img src="images/category_pic01_01.png" alt="">
                    <div>
                        <h3>红米Note2</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic01_02.png" alt="">
                    <div>
                        <h3>小米MIX</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic01_03.png" alt="">
                    <div>
                        <h3>小米5s</h3>
                    </div>
                </a>
            </div>
        </div>
        <div class="main">
            <div>
                <a href="">
                    <img src="images/category_pic01_04.png" alt="">
                    <div>
                        <h3>小米5s Plus</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic01_05.png" alt="">
                    <div>
                        <h3>小米5</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic01_06.png" alt="">
                    <div>
                        <h3>小米Max</h3>
                    </div>
                </a>
            </div>
        </div>
        <div class="main">
            <div>
                <a href="">
                    <img src="images/category_pic01_07.png" alt="">
                    <div>
                        <h3>红米4</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic01_08.png" alt="">
                    <div>
                        <h3>红米4A</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic01_09.png" alt="">
                    <div>
                        <h3>红米Note4</h3>
                    </div>
                </a>
            </div>
        </div>
        <div class="main">
            <div>
                <a href="">
                    <img src="images/category_pic01_10.png" alt="">
                    <div>
                        <h3>小米移动</h3>
                    </div>
                </a>
            </div>
        </div>
    </section>

    <!--笔记本·平板-->
    <section class="mybanner">
        <a href="">
            <img src="images/category_header02.jpg" alt="">
        </a>
    </section>
    <section>
        <header class="mainLine mainHead">
            <div>笔记本·平板</div>
        </header>
        <div class="main">
            <div>
                <a href="">
                    <img src="images/category_pic02_01.png" alt="">
                    <div>
                        <h3>笔记本12.5″</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic02_02.png" alt="">
                    <div>
                        <h3>笔记本13.3″</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic02_03.png" alt="">
                    <div>
                        <h3>笔记本配件</h3>
                    </div>
                </a>
            </div>
        </div>
        <div class="main">
            <div>
                <a href="">
                    <img src="images/category_pic02_04.png" alt="">
                    <div>
                        <h3>平板2</h3>
                    </div>
                </a>
            </div>
        </div>
    </section>

    <!--电视·盒子-->
    <section class="mybanner">
        <a href="">
            <img src="images/category_header03.jpg" alt="">
        </a>
    </section>
    <section>
        <header class="mainLine mainHead">
            <div>电视·盒子</div>
        </header>
        <div class="main">
            <div>
                <a href="">
                    <img src="images/category_pic03_01.png" alt="">
                    <div>
                        <h3>小米电视43″</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic03_02.png" alt="">
                    <div>
                        <h3>小米电视48″</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic03_03.png" alt="">
                    <div>
                        <h3>小米电视55″</h3>
                    </div>
                </a>
            </div>
        </div>
        <div class="main">
            <div>
                <a href="">
                    <img src="images/category_pic03_04.png" alt="">
                    <div>
                        <h3>小米电视60″</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic03_05.png" alt="">
                    <div>
                        <h3>小米电视65″</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic03_06.png" alt="">
                    <div>
                        <h3>分体电视70″</h3>
                    </div>
                </a>
            </div>
        </div>
        <div class="main">
            <div>
                <a href="">
                    <img src="images/category_pic03_07.png" alt="">
                    <div>
                        <h3>主机/低音炮</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic03_08.png" alt="">
                    <div>
                        <h3>家庭音响</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic03_09.png" alt="">
                    <div>
                        <h3>小米盒子</h3>
                    </div>
                </a>
            </div>
        </div>
        <div class="main">
            <div>
                <a href="">
                    <img src="images/category_pic03_10.png" alt="">
                    <div>
                        <h3>盒子mini版</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic03_11.png" alt="">
                    <div>
                        <h3>蓝牙手柄</h3>
                    </div>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="images/category_pic03_12.png" alt="">
                    <div>
                        <h3>电视/盒子配件</h3>
                    </div>
                </a>
            </div>
        </div>
    </section>

    <footer class="marginBtt"></footer>
    <nav class="navbarBtt">
        <a href="../index.html">
            <div class="midh index"></div>
            <div>首页</div>
        </a>
        <a href="#">
            <div class="midh categoryChecked"></div>
            <div>分类</div>
        </a>
        <a href="../cart/index.html">
            <div class="midh cart"></div>
            <div>购物车</div>
        </a>
        <a href="../user/index.html">
            <div class="midh user"></div>
            <div>我的</div>
        </a>
    </nav>


    <script src="bootstrap/js/jquery-3.1.1.js"></script>
    <script src="bootstrap/js/bootstrap.min.js"></script>
</body>

</html>